import React, { PureComponent } from 'react'
import { Page, Filter, List, DropOption } from 'components'
import { connect } from 'dva'
import { Button, Row, Col, Popconfirm, Input, DatePicker, Select } from 'antd'
import moment from 'moment';

@connect(({ ${namespace}, loading }) => ({${namespace}, loading}))
class Index extends PureComponent {

	render() {
		const {location, dispatch, ${namespace}, loading} = this.props
		
		const { query, pathname } = location
		
		const { list, pagination, currentItem, filterItems} = ${namespace}
		
		const handleRefresh = newQuery => {
			dispatch({type:'${namespace}/query',payload:{...query,...filterItems,...newQuery,pageSize:pagination.pageSize}})
		}
		
		const Columns=[<#list columns as field>
			{
				title:'${field.title}',
				dataIndex: '${field.dataIndex}',
				key: '${field.dataIndex}',<#if (field.align)>
				align:'left',</#if><#if (field.render)>
				render:(text, record) => {
					<#if (field.edit??)>
					return (<${field.edit} style={{width:'100%'}} defaultValue={<#if (field.edit=='DatePicker')>text?moment(text):moment()<#else>text</#if>} onBlur={e => record.${field.dataIndex}=<#if (field.edit=='Select')>e<#elseif (field.edit=='DatePicker')>moment(e).format('YYYY-MM-DD')<#else>e.target.value</#if>}/>)
					<#else>
					return (text);
					</#if>
				}</#if>
			},</#list>
		]
		
		const filterProps = {
			filterItemColumns:[<#list filters as filter>
				{
					type: '${filter.type}',
					label: '${filter.label}',
					target: '${filter.name}',
					tip: '輸入${filter.label}',
					key: '${filter.name}',
				},</#list>
			],
			onFilterChange(fields) {
				dispatch({
					type: '${namespace}/updateState',
					payload: { filterItems: fields },
				})
				dispatch({
					type: '${namespace}/query',
					payload: {
						page: 1,
						pageSize: pagination.pageSize,
						...fields,
						...query,
					},
				})
			},
			btns:[
				{
					text:'新增',
					handle:()=>{
						
					}
				}
			]
		}

		const listProps = {
			dataSource: list,
			loading: loading.effects['${namespace}/query'],
			Columns,
			pagination,
			onChange(page) {
				dispatch({
					type: '${namespace}/query',
					payload: {
						...query,
						...filterItems,
						page: page.current,
						pageSize: page.pageSize,
					},
				})
			},
		}
		
		return (
			<Page inner>
				<Filter {...filterProps} />
				<List {...listProps} />
			</Page>
		)
	}
}

export default Index
